import Vue from 'vue'
import App from './App'
import VueRouter from 'vue-router'
import router from './router'
import Mint from 'mint-ui'
import moment from 'moment'
import VuePreview from 'vue-preview'
import Vuex from 'vuex'
import './assets/mui/dist/css/mui.min.css'
import 'mint-ui/lib/style.css'
import './assets/font/iconfont.css'
import {
    Header,
    TabContainer,
    TabContainerItem,
    Tabbar,
    TabItem,
    Badge,
    Swipe,
    SwipeItem,
    Button,
    Spinner,
    Lazyload,
    Navbar,
    Actionsheet,
    Switch,
    Search,
    Field,
} from 'mint-ui';

Vue.use(VueRouter)
Vue.use(Mint)
Vue.use(Lazyload)
Vue.use(VuePreview, {
    mainClass: 'pswp--minimal--dark',
    barsSize: { top: 0, bottom: 0 },
    captionEl: false,
    fullscreenEl: false,
    shareEl: false,
    bgOpacity: 0.85,
    tapToClose: true,
    tapToToggleControls: false
})
Vue.use(Vuex)
Vue.component(Header.name, Header);
Vue.component(TabContainer.name, TabContainer);
Vue.component(TabContainerItem.name, TabContainerItem);
Vue.component(Tabbar.name, Tabbar);
Vue.component(TabItem.name, TabItem);
Vue.component(Badge.name, Badge);
Vue.component(Swipe.name, Swipe);
Vue.component(SwipeItem.name, SwipeItem);
Vue.component(Button.name, Button);
Vue.component(Spinner.name, Spinner);
Vue.component(Navbar.name, Navbar);
Vue.component(Actionsheet.name, Actionsheet);
Vue.component(Switch.name, Switch);
Vue.component(Search.name, Search);
Vue.component(Field.name, Field);
Vue.config.productionTip = false
Vue.filter('dateFormat', (data, pattern = "YYYY-MM-DD HH:mm:ss") => moment(data).format(pattern))

// 取本地缓存信息
const car = JSON.parse(localStorage.getItem('car') || '[]')
const store = new Vuex.Store({
    state: {
        // id,count,price,selected
        car: car
    },
    mutations: {
        addTocar(state, goodsInfo) {
            let flag = false;
            state.car.some(item => {
                if (item.id == goodsInfo.id) {
                    item.count += parseInt(goodsInfo.count)
                    flag = true
                    return true
                }
            })
            if (!flag) {
                state.car.push(goodsInfo)
            }
            localStorage.setItem('car', JSON.stringify(state.car))
        },
        removeGood(state, id) {
            state.car.some((item, i) => {
                if (item.id == id) {
                    state.car.splice(i, 1)
                    return true
                }
            })
            localStorage.setItem('car', JSON.stringify(state.car))
        },
        selectGood(state, info) {
            state.car.some((item, i) => {
                if (item.id == info.id) {
                    item.selected = info.selected
                    return true
                }
            })
            localStorage.setItem('car', JSON.stringify(state.car))
        }
    },
    getters: {
        getAllcount(state) {
            let c = 0;
            state.car.forEach(item => {
                c += item.count
            })
            return c
        },
        getPriceCount(state) {
            let o = {
                count: 0, // 商品的总件
                amount: 0 // 商品的总价格
            }
            state.car.forEach(item => {
                if (item.selected) {
                    o.count += item.count
                    o.amount += item.price * item.count
                }
            })
            return o
        }
    }
})

const vm = new Vue({
    el: '#app',
    router,
    render: c => c(App),
    store
})